<template>
    <div class="menu">
        <Menu ref="menu" :active-name="menu" theme="dark" width="auto" :open-names="['1']" @on-select="openView">
            <div class="layout-logo-left"><img src="../images/menubg.jpg"></div>
            <MenuItem name="帐号管理" v-if="authorize==0"> 帐号管理
            </MenuItem>
            <MenuItem name="项目管理" v-if="authorize==0"> 项目管理
            </MenuItem>
            <MenuItem name="项目列表">项目列表</MenuItem>
        </Menu>
    </div>
</template>
<script>
export default {
    data() {
            return {
                menu: "帐号管理"
            }

        },
        methods: {
            openView(name) {
                this.$router.push(name)
                console.log(name);
                this.bread = "/" + name;
            },

        },
        mounted() {


            // console.log(localStorage.authorize);


            this.$nextTick(() => {
                this.menu = this.$route.path.slice(1)
                this.$refs.menu.updateActiveName();
            })


        },
        watch: {

            $route(to, from) {
                this.$nextTick(() => {
                    this.menu = this.$route.path.slice(1)
                    this.$refs.menu.updateActiveName();
                })
            }
        },
        computed: {
            authorize() {
                return localStorage.authorize

            }
        }

}
</script>
<style>
@import '../style/style.css';

/*引入公共样式*/
</style>
<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
</style>
